<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Personal Portfolio - Louis Young</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <link rel="stylesheet" href="index.css">
</head>
<body>
<header>
    <nav id="navbar">
        <a href="https://louisyoung.work/">
            <img id="logo" src="./img/LOUIS-LOGO-BLANK.gif" alt="logo"></a>
        <ul class="nav-list">
            <li class="nav-item">
                <a href="#welcome-section">About</a>
            </li>
            <li class="nav-item">
                <a href="#projects">Work</a>
            </li>
            <li class="nav-item">
                <a href="#contact">Contact</a>
            </li>
        </ul>
    </nav>
</header>
<main>
    <article id="welcome-section">
        <h1 id="title">Web Developer creating thoughtful intuitive code.</h1>
        <p>
            I’m Louis Young, a Web Developer with three years of experience.
            I specialise in web app develop for mobile and web-based applications with a focus on simplicity & usability
        </p>
    </article>
    <hr class="hr-bottom">
    <article id="projects">
        <div id="projects-title">
            <h2>My Projects</h2>
        </div>
        <div id="projects-list">
<!--            <section class="project">-->
<!--                <figure>-->
<!--                    <div class="project-img-container">-->
<!--                        <img class="project-img" src="../docs/tribute-page.png" alt="Tribute Page">-->
<!--                    </div>-->
<!--                    <figcaption>-->
<!--                        <h3>Tribute Page</h3>-->
<!--                        <p>Erwin Schrödinger</p>-->
<!--                    </figcaption>-->
<!--                </figure>-->
<!--            </section>-->
        </div>
    </article>
    <hr class="hr-top hr-bottom">
    <article id="contact">
        <h2 class="title">Let's work together...</h2>
        <em>How do you take your coffee?</em>
        <div id="contact-list">
            <a class="contact-link" id="profile-link" href="https://github.com/louisyoungx" target="_blank">
                <img class="contact-icon" src="./img/github-white.svg" alt="github">
            </a>
            <a class="contact-link" id="twitter-link" href="https://twitter.com/louisyoungx" target="_blank">
                <img class="contact-icon" src="./img/twitter-white.svg" alt="twitter">
            </a>
            <a type="button" href="mailto:1462648167@qq.com" class="contact-email">Email me</a>
        </div>
    </article>
    <hr class="hr-top hr-bottom">
</main>
<footer>
    <h5>Personal Portfolio - Louis Young</h5>
    <h6>Copyright © 2021 LouisYoung Inc. All rights reserved.</h6>
</footer>
<script src="./index.js"></script>
<!--<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>-->
</body>
</html>